<!--
 * @Description: 
 * @Version: 0.0.0
 * @Autor: 源
 * @Date: 2022-10-22 08:37:28
 * @LastEditors: 源
 * @LastEditTime: 2022-11-01 11:53:44
 * @FilePath: \pnpm-v3-ts-ui\docs\.vitepress\theme\layout.vue
-->
<template>
  <Layout>
    <template #layout-bottom>
      <div
        class="top"
        @click="clickTop"
        v-if="isTop"
      >
        <lm-icon
          name="top"
          :size="24"
        />
      </div>
    </template>
  </Layout>

</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import DefaultTheme from 'vitepress/theme';
const Layout = DefaultTheme.Layout
const isTop = ref(false)
const scrollHandle = (e) => {
  let top = e.srcElement.scrollingElement.scrollTop; // 获取页面滚动高度
  if (top > 400) {
    isTop.value = true;
  } else {
    isTop.value = false;
  }
}
const clickTop = () => {
  document.documentElement.scrollTop = 0
}
onMounted(() => {
  window.addEventListener("scroll", scrollHandle); //绑定页面滚动事件
})


</script>